<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>登录客服工作台</title>
    <link href="__STATIC__/service/css/reset.css" rel="stylesheet" type="text/css"/>
    <link href="__STATIC__/service/css/reg.css" rel="stylesheet" type="text/css"/>
    <script src="__STATIC__/common/js/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="__STATIC__/layui/layui.js"></script>
</head>
<body style="background:url(__STATIC__/service/images/bg01.png) repeat-y center top;overflow:hidden;">
	<div class="g-regradius">
	    <img src="__STATIC__/service/picture/oval01.png" width="80" height="auto" style="left:0; top:30px;">
	    <img src="__STATIC__/service/picture/oval02.png" width="100" height="auto" style="right:0; top:30px;">
	    <img src="__STATIC__/service/picture/oval02.png" width="60" height="auto" style="right:-20px; top:50px;">
	    <img src="__STATIC__/service/picture/oval02.png" width="100" height="auto" style="right:-20px; bottom:-50px;">
	    <img src="__STATIC__/service/picture/oval01.png" width="40" height="auto" style="right:220px; bottom:90px;">
	    <img src="__STATIC__/service/picture/bg02.png" width="777" height="auto" style="left:50%; margin-left:-550px; bottom:-200px;">
	</div>
<div class="g-reg">

    <div class="g-regin">
        <div class="m-regbox f-clearfix">
            <div class="m-box-left" style="height:460px;">
                <div class="m-pictop"><img src="__STATIC__/service/picture/leftpic03.png" width="66" height="44"></div>
                <div class="m-picbottom"><img src="__STATIC__/service/picture/leftpic01.png" width="78" height="39"></div>
                <div class="m-picmiddle"><img src="__STATIC__/service/picture/desk01.png"></div>
                <div id="weixinLoginDialog"></div>
            </div>
            <div class="m-box-right" style="height:460px;">
                <form id="loginForm">
                    <div class="m-boxr-in">
                        <h2 class="m-boxr-title">
                            客服工作台
                        </h2>
                        <div class="m-form form-group">
                            <div class="form-input has-icon w-placeholder">
                                <span class="m-formicon"><img src="__STATIC__/service/picture/user01.png"></span>
                                <input class="form-control" type="text" placeholder="账号" id="username" name="username" autocomplete="off">
                            </div>
                        </div>
                        <div class="m-form form-group">
                            <div class="form-input has-icon w-placeholder">
                                <span class="m-formicon"><img src="__STATIC__/service/picture/lock01.png"></span>
                                <input class="form-control" type="password" placeholder="密码" id="password" name="password">
                            </div>
                        </div>
                        <div class="m-form form-group m-piccode m-hastitle f-clearfix">
                            <div class="form-input">
                                <input class="form-control" style="width: 130px;" id="validcode" type="text" placeholder="验证码" name="validcode" autocomplete="off">
                                <span class="u-piccode" style="right:40px;"><img id="imgCode" src="{:captcha_src()}" onclick="this.src='{:captcha_src()}?t='+Math.random();" title="不清楚? 点击换一个"></span>
                            </div>
                        </div>
                        <div class="m-form m-form-bottom">
                            <div class="form-input">
                                <a href="javascript:void(0)" class="m-btn m-jbbtn m-btn-block m-btn-middle f-relative" style="z-index:4;" id="loginBtn">登录</a>
                            </div>
                        </div>
                        <div style="margin-top:30px;text-align:center;color: #969696;">Copyright © 2015-{:date('Y')} AI智能客服版权所有</div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<script>
    var seller = "{$seller}";
    document.onkeydown=function(event){
        var e = event || window.event || arguments.callee.caller.arguments[0];
        if(e && e.keyCode==13){ // enter 键
            doLogin();
        }
    };

    $(function(){
        $("#loginBtn").click(function(){
            doLogin();
        });
    });

    function initCode() {
        $('#imgCode').attr("src","{:captcha_src()}?t=" + Math.random());
    }

    function doLogin(){
        layui.use(['layer'], function(){
            var layer = layui.layer;
            layer.ready(function(){
                var user_name = $("#username").val();
                var password = $("#password").val();
                var validcode = $("#validcode").val();

                if('' == user_name){
                    layer.tips('请输入用户名', '#username');
                    return false;
                }

                if('' == password){
                    layer.tips('请输入密码', '#password');
                    return false;
                }

                if('' == validcode){
                    layer.tips('请输入验证码', '#validcode');
                    return false;
                }

                var index = layer.load(0, {shade: false});
                $.post('/service/login/doLogin', {
                    username: user_name,
                    password: password,
                    validcode: validcode,
                    seller: seller
                }, function(res){
                    layer.close(index);
                    if(0 == res.code){
                        window.location.href = res.data;
                    }else{
                        layer.msg(res.msg,{icon:2,time:1000},function () {
                            initCode();
                        })
                    }
                }, 'json');
            });
        });
    }
</script>
</body>
</html>
